<template>
	<view>
		<uNavbar title="支付中心"></uNavbar>
		<view class="pay_money flex_ZC">
			<text class="f32">实付金额（{{this.payType ==5?'FUL':'元'}}）</text>
			<text class="c5">{{ calculatePrice()}}</text>
		</view>

		<view class="pay_box flex_Z">
			<text>请选择支付方式</text>
			
			<view class="pay_type flex_Z" v-if="pay6" @click="combinationPay">
				<view class="balance flex_dq">
					<view class="pay_type_l flex_c">
						<image src="../../static/icon/i_checkbox.png" mode="aspectFill" v-if="zuhe"></image>
						<image src="../../static/icon/i_checkbox1.png" mode="" v-else></image>
					</view>
					<view class="balance_top_s flex_dq" >
						<image class="img3" src="../../static/icon/fhtb.png" mode="aspectFill"></image>
						<text class="c3">通宝</text>
						<text class="c3">{{zuhetb}}</text>
						<view class="flex_dq" v-if="pay4">
							<text class="c3" style="margin: 0 6rpx 0 14rpx;"> + </text>
							<image class="img4" src="../../static/image/fhyb.png" mode="aspectFill"></image>
							<text class="c3">元宝</text>
							<text class="c3">{{zuheyb}}</text>
						</view>
					</view>
				</view>
				<view class=" flex_dq">
					<view class="keyong flex_dq">
						<image class="img3" src="../../static/icon/fhtb.png" mode=""></image>
						<text >可用：{{FhTongb}}</text>
					</view>
					<view class="keyong flex_dq">
						<image class="img4" src="../../static/image/fhyb.png" mode=""></image>
						<text >可用：{{FhYuanb}}</text>
					</view>
				</view>
			</view>
			<view class="pay_type flex_Z" v-if="pay3" @click="isFhtb">
				<view class="balance flex_dq">
					<view class="pay_type_l flex_c">
						<image src="../../static/icon/i_checkbox.png" mode="aspectFill" v-if="fhtb"></image>
						<image src="../../static/icon/i_checkbox1.png" mode="" v-else></image>
					</view>
					<view class="balance_top flex_dq">
						<image class="img1" src="../../static/icon/fhtb.png" mode=""></image>
						<text>福合通宝</text>
					</view>
				</view>
				<text class="available">可用：{{FhTongb}}</text>
			</view>
			<view class="pay_type flex_Z" v-if="pay4" @click="isYuanshi">
				<view class="balance flex_dq">
					<view class="pay_type_l flex_c">
						<image src="../../static/icon/i_checkbox.png" mode="aspectFill" v-if="yuans"></image>
						<image src="../../static/icon/i_checkbox1.png" mode="" v-else></image>
					</view>
					<view class="balance_top flex_dq">
						<image class="img2" src="../../static/image/fhyb.png" mode=""></image>
						<text>福合元宝</text>
					</view>
				</view>
				<text class="available">可用：{{FhYuanb}}</text>
			</view>
			<view class="pay_type flex_Z" v-if="pay5" @click="isFul">
				<view class="balance flex_dq">
					<view class="pay_type_l flex_c">
						<image src="../../static/icon/i_checkbox.png" mode="aspectFill" v-if="ful"></image>
						<image src="../../static/icon/i_checkbox1.png" mode="" v-else></image>
					</view>
					<view class="balance_top flex_dq">
						<image class="img1" src="../../static/icon/i_ful.png" mode=""></image>
						<text>FUL余额</text>
					</view>
				</view>
				<text class="available">可用：{{FhFul}}</text>
			</view>
			<view class="pay_type flex_Z" v-if="pay7" @click="isJifen">
				<view class="balance flex_dq">
					<view class="pay_type_l flex_c">
						<image src="../../static/icon/i_checkbox.png" mode="aspectFill" v-if="jifen"></image>
						<image src="../../static/icon/i_checkbox1.png" mode="" v-else></image>
					</view>
					<view class="balance_top flex_dq">
						<image class="img7" src="../../static/icon/i_integral.png" mode=""></image>
						<text>生态积分</text>
					</view>
				</view>
				<text class="available">可用：{{FhIntegral}}</text>
			</view>
			
			<view class="pay_type flex_Z" v-if="pay8" @click="isXsheng">
				<view class="balance flex_dq">
					<view class="pay_type_l flex_c">
						<image src="../../static/icon/i_checkbox.png" mode="aspectFill" v-if=" xsheng"></image>
						<image src="../../static/icon/i_checkbox1.png" mode="" v-else></image>
					</view>
					<view class="balance_top flex_dq">
						<image class="img2" src="../../static/image/xs_pay.png" mode=""></image>
						<text>新生钱包</text>
					</view>
				</view>
				<text class="available">可用：{{FhXsheng}}</text>
			</view>

		</view>
		<view class="ready_my flex_c" @click="isReady" v-if="!readyMoney">
			<text>加载中</text>
		</view>
		<view v-else>
			<view class="submit flex_c" @click="confirmShow" v-if="haveCache">
				<image class="highlights" src="../../static/image/mask.png" mode=""></image>
				<text>确认下单</text>
			</view>
		</view>

		<view class="notice flex_Z" v-if="nodeCentent">
			<text class="f36 c6">购买需知</text>
			<rich-text class="notice_txt f24 c9" :nodes="nodeCentent"></rich-text>
		</view>
		<u-popup :show="warningShow" mode="center" :overlayStyle='overlayStyle' bgColor="transparent">
			<view class="prompt flex_ZC">
				<text class="f36">提示</text>
				<text class="warning_txt">请通过正规流程购买商品!</text>
				<view class="prompt_ntm" @click="userConfrim">
					<text>确认</text>
				</view>
				<view class="empty"></view>
			</view>
		</u-popup>
		
		<u-popup :show="tipShow" mode="center" @close="tipShow = false" closeable bgColor="transparent">
			<view class="prompt flex_ZC">
				<text class="f36">提示</text>
				<text class="prompt_tit">{{remind}}</text>
				<view class="prompt_ntm" @click="goNixtPage">
					<text>现在就去</text>
				</view>
				<view class="empty"></view>
			</view>
		</u-popup>
		
		<u-popup :show="keyboardShow" mode="center" @close="keyboardShow=false" closeable bgColor="transparent">
			<view class="pass_wrap">
				<view class="tit">
					请输入交易密码
				</view>
				<u-code-input disabledDot :adjustPosition="false" borderColor="#555275" focus class="code_input"
					v-model="securityPwd" mode="line" dot></u-code-input>
				<view class="other_btnwrap">
					<view class="other_btn1" @click="keyboardShow=false,securityPwd=''">
						取消
					</view>
					<view class="other_btn2" @click="valChange()">
						确认
					</view>
				</view>
			</view>
		</u-popup>
		<!-- 		<u-keyboard ref="uKeyboard" dotDisabled mode="number" closeOnClickOverlay :tooltip="false" :show="keyboardShow"
			@close="keyboardShow = false" @change="valChange" @backspace="backspace">
			<view class="keyboardss flex_ZC">
				<text>安全密码</text>
				<u-code-input dot space="26" v-model="securityPwd"></u-code-input>
			</view>
		</u-keyboard> -->
	</view>
</template>

<script>
	import {
		getuserinfo,
		memberBalance
	} from "../../api/index.js";
	import {
		createOrder,
		goodsCreateHatchOrder,
		rentCreateOrder,
		rentOrdersPay,
		rentOrderInfo,
		proporderInfo,
		proppay,
		rentCreateHatchOrder,
		getOrderPayType,
		propcreateOrder
	} from "../../api/store.js";
	export default {
		data() {
			return {
				FhTongb: 0, //通宝
				FhYuanb: 0, //元宝
				FhFul: 0, //ful
				FhIntegral:0,//生态积分
				FhXsheng:0, //新生钱包
				productType: '', //1平台首发 2自由坊  3道具坊 4品牌首发 5孵化坊 
				securityPwd: '', //安全密码
				proportion: '', //ful支付比例
				remind: "", //提示语
				ufl_rmb_prop: "",
				nodeCentent:'',
				zuhetb:'',
				zuheyb:'',
				payType: null, //3 福合通宝 、4福合元宝
				fhtb: false,
				yuans: false,
				ful: false,
				jifen:false,
				xsheng:false,
				zuhe: false,
				pay3: true,
				pay4: true,
				pay5: false,
				pay6: false,
				pay7: false,
				pay8: false,
				tipShow: false,//提示
				keyboardShow: false, //输入框
				warningShow:false,//警告
				haveCache: false, //有无缓存 
				readyMoney: false, // 金币接口是否准备完毕
				cacheData: {} ,//待支付商品缓存信息
				overlayStyle:{
					 backdropFilter:'blur(4px)',
					  
				}
			}
		},
		onLoad(e) {
			this.getuser()
			// console.log('--------', uni.getStorageSync('productCacheInfo'));
			this.cacheData = uni.getStorageSync('productCacheInfo')
			this.productType = uni.getStorageSync('productCacheInfo').productType
			if (uni.getStorageSync('productCacheInfo')) {
				if (this.productType == 1) {
					if (this.ufl_rmb_prop != "0.00") {
						this.ufl_rmb_prop = this.cacheData.ufl_rmb_prop
					}
				}
				this.haveCache = true
				this.nodeCentent = this.cacheData.notice.replace(/\r\n/g, "<p/>") || '';
				this.isPayTypeOther(this.cacheData.allMoney, this.cacheData.goodsId)
			} else {
				this.haveCache = false
				this.warningShow = true
			}
		},
		onShow() {
			this.tipShow = false
		},
		methods: {
			// 价格计算
			calculatePrice() {
				if (this.payType == '5') {
					console.log(this.proportion, "--------- 5 ful支付、保留6位小数")
					return (this.cacheData.allMoney / this.proportion).toFixed(6)
				} else {
					return this.cacheData.allMoney
				}
			},
			isPayTypeOther(money, id) {
				uni.showLoading({
					title: "加载中",
					mask: true
				})
				let data = {
					pay_scene: this.productType,
					pay_amount: money,
					id: id,
				}
				getOrderPayType(data).then(res => {
					console.log(res)
					uni.hideLoading()
					if (res.code == 1) {
						let pay3 = res.data.pay_type.includes(3)
						let pay4 = res.data.pay_type.includes(4);
						let pay5 = res.data.pay_type.includes(5);
						let pay6 = res.data.pay_type.includes(6);
						let pay7 = res.data.pay_type.includes(7);
						let pay8 = res.data.pay_type.includes(8);
						this.pay3 = pay3 ? true : false;
						this.pay4 = pay4 ? true : false;
						this.pay5 = pay5 ? true : false;
						this.pay6 = pay6 ? true : false;
						this.pay7 = pay7 ? true : false;
						this.pay8 = pay8 ? true : false;
						console.log(res.data.pay_type[0]);
						this.payType = res.data.pay_type[0]
						if(this.payType == 3){
							this.fhtb = true
						}else if(this.payType == 4){
							this.yuans = true
						}else if(this.payType == 6){
							this.zuhe = true
						}else if(this.payType == 7){
							this.jifen = true
						}else if(this.payType == 8){
							this.xsheng = true
						}
						if(this.productType == 4 || this.productType == 5){
							this.zuhetb =  res.data.tb_pay_balance
							this.zuheyb =  res.data.yb_pay_balance
						}
						console.log("允许支付方式", pay3, pay4, pay5, pay6,pay7,pay8)
					}
				})
			},
			// 用户信息
			getuser() {
				uni.showLoading({
					title: "加载中",
					mask: true
				})
				memberBalance().then(res => {
					uni.hideLoading()
					console.log(res)
					if (res.code == 1) {
						this.readyMoney = true
						this.FhTongb = res.data.balance || 0
						this.FhYuanb = res.data.balance_hf || 0
						this.FhFul = res.data.balance_ful || 0
						this.FhIntegral = res.data.integral || 0
						this.FhXsheng = res.data.balance_xs || 0
						if (this.ufl_rmb_prop != "0.00") {
							this.proportion = this.ufl_rmb_prop
						} else {
							this.proportion = res.data.ufl_rmb_prop
						}
					}
				})
			},

			isReady() {
				uni.$u.toast('数据加载中...');
			},
			confirmShow() {
				console.log('支付方式', this.payType);
				if (this.payType == 3) {
					if (Number(this.cacheData.allMoney) > Number(this.FhTongb)) {
						uni.$u.toast('福合通宝余额不足');
					} else {
						this.keyboardShow = true
					}
				} else if (this.payType == 4) {
					if (Number(this.cacheData.allMoney) > Number(this.FhYuanb)) {
						uni.$u.toast('福合元宝余额不足');
					} else {
						this.keyboardShow = true
					}
				} else if (this.payType == 5) {
					if (Number(this.cacheData.allMoney / 10) > Number(this.FhFul)) {
						uni.$u.toast('Ful余额不足');
					} else {
						this.keyboardShow = true
					}
				} else if (this.payType == 6){
					this.keyboardShow = true
				}else if (this.payType == 7){
					if (Number(this.cacheData.allMoney / 10) > Number(this.FhIntegral)) {
						uni.$u.toast('生态积分不足');
					} else {
						this.keyboardShow = true
					}
				}else if (this.payType == 8){
					if (Number(this.cacheData.allMoney / 10) > Number(this.FhXsheng)) {
						uni.$u.toast('新生钱包余额不足');
					} else {
						this.keyboardShow = true
					}
				}
				 else {
					uni.$u.toast('请选择支付方式');
				}
			},
			// 输入密码
			valChange() {
				let that = this;
				if (this.securityPwd.length < 6) {
					uni.$u.toast("交易密码为6位")
					console.log(this.securityPwd);
				}
				if (this.securityPwd.length >= 6) {
					this.keyboardShow = false
					if (this.productType == 1) {
						this.isCreateOrder()
					} else if (this.productType == 2) {
						this.rentCreateOrders()
					} else if (this.productType == 3) {
						this.proppays()
					} else if (this.productType == 4) {
						this.isgoodsCreateHatchOrder()
					} else if (this.productType == 5) {
						let yanshi =  uni.$u.random(10, 15)*1000
						uni.showLoading({
							title: '抢购排队中，请等待',
							mask: true
						});
						console.log('延时----',yanshi)
						setTimeout(function() {
							that.payfhdt()
						}, yanshi);
						
					}
				}
			},
			// 平台首发 
			isCreateOrder() {
				let data = {
					goods_id: this.cacheData.selectId,
					number: this.cacheData.numbers,
					pay_type: this.payType,
					password: this.securityPwd,
				};
				uni.showLoading({
					title: '抢购排队中，请等待',
					mask: true
				});
				createOrder(data).then(res => {
					console.log(res)
					uni.hideLoading()
					this.securityPwd = ''
					if (res.code == 1) {
						uni.$u.toast(res.msg);
						setTimeout(function() {
							uni.redirectTo({
								url: '/pagesMy/mallCenter/paySuccess?type=' + 1
							})
						}, 1500);
					} else {
						uni.$u.toast(res.msg);
					}
				})
			},
			// 自由坊
			rentCreateOrders() {
				uni.showLoading({
					title: '抢购排队中，请等待'
				});
				rentCreateOrder({
					id: this.cacheData.selectId.join(','),
					pay_type: this.payType,
					password: this.securityPwd,

				}).then(res => {
					uni.hideLoading()
					this.securityPwd = ''
					uni.$u.toast(res.msg);
					if (res.code == 1) {
						setTimeout(function() {
							uni.redirectTo({
								url: '/pagesMy/mallCenter/paySuccess?id=' + 1 + '&type=' + 2
							})
						}, 1500);
					} else {
						uni.$u.toast(res.msg);
					}
				})
			},
			// 道具坊
			proppays() {
				uni.showLoading({
					title: '抢购排队中，请等待'
				});
				propcreateOrder({
					id: this.cacheData.selectId,
					pay_type: this.payType,
					password: this.securityPwd
				}).then(res => {
					uni.hideLoading()
					this.securityPwd = ''
					if (res.code == 1) {
						setTimeout(function() {
							uni.redirectTo({
								url: '/pagesMy/mallCenter/paySuccess?type=' + 3
							})
						}, 1500);
					}
					uni.$u.toast(res.msg);
				})
			},
			//品牌首发
			isgoodsCreateHatchOrder() {
				let data = {
					goods_id: this.cacheData.selectId,
					number: this.cacheData.numbers,
					pay_type: this.payType,
					password: this.securityPwd,
				};
				uni.showLoading({
					title: '抢购排队中，请等待'
				});
				goodsCreateHatchOrder(data).then(res => {
					console.log(res)
					uni.hideLoading()
					this.securityPwd = ''
					if (res.code == 1) {
						uni.$u.toast(res.msg);
						setTimeout(function() {
							uni.redirectTo({
								url: '/pagesMy/mallCenter/paySuccess?type=' + 1
							})
						}, 1500);
					} else {
						uni.$u.toast(res.msg);
					}
				})
			},
			// 孵化坊
			payfhdt() {
				// uni.showLoading({
				// 	title: '抢购排队中，请等待'
				// });
				rentCreateHatchOrder({
					id: this.cacheData.pid,
					number: this.cacheData.number,
					pay_type: this.payType,
					password: this.securityPwd
				}).then(res => {
					uni.hideLoading()
					this.securityPwd = ""
					if (res.code == 1) {
						setTimeout(function() {
							uni.redirectTo({
								url: '/pagesMy/mallCenter/paySuccess?id=' + 1 + '&type=' + 2
							})
						}, 1500);
						uni.$u.toast(res.msg);
					} else if (res.code == 1001) {
						this.remind = res.msg
						this.tipShow = true
					}
				})
			},

			// 退格键被点击
			backspace() {
				// 删除value的最后一个字符
				if (this.securityPwd.length) this.securityPwd = this.securityPwd.substr(0, this.securityPwd.length - 1);
				console.log(this.securityPwd);
			},
			isFhtb() {
				if (!this.fhtb) {
					this.fhtb = !this.fhtb
					this.yuans = false
					this.ful = false
					this.zuhe = false
					this.jifen = false
					this.xsheng = false
					this.payType = 3
				}
			},
			isYuanshi() {
				if (!this.yuans) {
					this.yuans = !this.yuans
					this.fhtb = false
					this.ful = false
					this.zuhe = false
					this.jifen = false
					this.xsheng = false
					this.payType = 4
				}
			},
			isFul() {
				if (!this.ful) {
					this.ful = !this.ful
					this.fhtb = false
					this.yuans = false
					this.zuhe = false
					this.jifen = false
					this.xsheng = false
					this.payType = 5
				}
			},
			isJifen(){
				if (!this.jifen) {
					this.jifen = !this.jifen
					this.fhtb = false
					this.ful = false
					this.xsheng = false
					this.yuans = false
					this.zuhe = false
					this.payType = 7
				}
			},
			isXsheng(){
				console.log(this.xsheng);
				if (!this.xsheng) {
					this.xsheng = !this.xsheng
					this.fhtb = false
					this.ful = false
					this.yuans = false
					this.jifen = false
					this.zuhe = false
					this.payType = 8
				}
			},
			combinationPay() {
				if (!this.zuhe) {
					this.zuhe = !this.zuhe
					this.fhtb = false
					this.ful = false
					this.yuans = false
					this.jifen = false
					this.xsheng = false
					this.payType = 6
				}
			},
			userConfrim(){
				uni.switchTab({
					url:'/pages/index/index'
				})
			},
			goNixtPage() {
				uni.navigateTo({
					url: '/pagesMy/brandCenter/numbercard?id=' + this.cacheData.pinpaiId
				})
			},
		},
		onUnload() {
			console.log('触发卸载');
			uni.removeStorageSync("productCacheInfo")
		},
	}
</script>

<style scoped lang="scss">
	@font-face {
		font-family: 'iconfont';
		src: url("~@/iconfont/almm.ttf");
	}

	.pay_money {
		width: 100%;
		margin-top: 100rpx;
		color: #666666;
	}

	.pay_money>text:nth-child(2) {
		font-size: 90rpx;
		margin: 20rpx 0;
	}

	.pay_box {
		margin-top: 50rpx;
	}

	.pay_box>text {
		color: #333333;
		font-size: 24rpx;
		margin: 20rpx 30rpx;
	}

	.pay_type {
		width: 690rpx;
		background: #F2F2F2;
		border-radius: 14rpx;
		margin: 0 auto 24rpx;
	}

	.img1 {
		width: 50rpx;
		height: 50rpx;
		margin-right: 20rpx;
	}

	.img2 {
		width: 50rpx;
		height: 38rpx;
		margin-right: 20rpx;
		padding-bottom: 14rpx;
	}

	.img3 {
		width: 32rpx;
		height: 32rpx;
		margin-right: 10rpx;
	}

	.img4 {
		width: 36rpx;
		height: 28rpx;
		margin-left: 10rpx;
		margin-right: 10rpx;
	}
	.img7{
		width: 54rpx;
		height: 54rpx;
		margin-right: 20rpx;
	}

	.pay_type_l {
		width: 20%;
	}

	.pay_type_l>image {
		width: 36rpx;
		height: 36rpx;
	}
	.combination_show{
		display: flex;
		align-items: center;
		width: 92%;
		background: pink;
	}
	.combination_show_box{
		width: 30%;
		background: skyblue;
	}

	.balance {
		width: 100%;
	}

	.balance_top {
		width: 70%;
		padding: 30rpx 0;
		font-size: 32rpx;
		color: #333333;
		font-family: 'iconfont';
		border-bottom: 1rpx solid #00000010;
	}

	.balance_top_s {
		width: 70%;
		padding: 40rpx 0;
		font-size: 24rpx;
		color: #ffffff;
		font-family: 'iconfont';
		border-bottom: 1rpx solid #00000010;
	}

	.available {
		font-size: 28rpx;
		color: #A68A64;
		padding: 20rpx 0;
		margin-left: 140rpx;
	}
	.keyong{
		font-size: 28rpx;
		color: #A68A64;
		padding: 20rpx 0;
		margin-left: 56rpx;
	}
	.ready_my {
		position: relative;
		width: 92%;
		margin: 80rpx auto 30rpx;
	}

	.ready_my>text {
		text-align: center;
		width: 100%;
		background: #c8c9cc;
		color: #ffffff80;
		font-size: 32rpx;
		padding: 20rpx 0;
		border-radius: 40rpx;
	}

	.submit {
		position: relative;
		width: 92%;
		margin: 80rpx auto 30rpx;
	}

	.submit>text {
		text-align: center;
		width: 100%;
		background: linear-gradient(274deg, #AB8E68, #D7BA93);
		color: #ffffff;
		font-size: 32rpx;
		padding: 20rpx 0;
		border-radius: 40rpx;
	}

	.notice {
		width: 590rpx;
		margin: 0 auto;
		padding-bottom: 30rpx;
	}

	.notice>text {
		margin: 20rpx 0;
	}

	.notice_txt {
		line-height: 1.5;
	}

	.keyboardss {
		width: 690rpx;
		margin: 20rpx auto;
	}

	/deep/.u-code-input {
		display: flex;
		align-items: center;
		justify-content: space-evenly;
		width: 100%;
		margin: 20rpx 0;
	}

	/deep/.u-code-input__item {
		margin-right: 0px !important;
	}


	.prompt {
		width: 600rpx;
		background: #E0DDDA;
		margin: 0 auto;
		border-radius: 20rpx;
		padding-top: 30rpx;
	}

	.prompt>text {
		margin-top: 40rpx;
	}

	.prompt_tit {
		margin: 0 30rpx;
		font-size: 28rpx;
		color: #666666;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;
	}

	.prompt_ntm {
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 30rpx;
		width: 414rpx;
		height: 72rpx;
		line-height: 72rpx;
		background: linear-gradient(274deg, #AB8E68, #D7BA93);
		border-radius: 28rpx;
		margin-top: 80rpx;
		color: #ffffff;
	}
	.warning_txt{
		color: #fa3534;
	}

	.ssssd {
		margin: 0 30rpx;
		font-size: 28rpx;
		color: #A6A5AF;
	}


	.pass_wrap {
		width: 602rpx;
		height: 406rpx;
		background: #E0DDDA;
		border-radius: 22rpx 22rpx 22rpx 22rpx;
		z-index: 998;

		.tit {
			width: 602rpx;
			text-align: center;
			font-size: 36rpx;
			color: #262626;
			padding-top: 50rpx;
			margin-bottom: 70rpx;
		}

		.code_input {
			margin: 0 auto;
		}

		.other_btnwrap {
			width: 522rpx;
			height: 72rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin: 0 auto;
			margin-top: 50rpx;

			.other_btn1 {
				width: 220rpx;
				height: 72rpx;
				border-radius: 280rpx 280rpx 280rpx 280rpx;
				border: 2rpx solid #A68A64;
				font-size: 28rpx;
				color: #A68A64;
				text-align: center;
				line-height: 72rpx;
			}

			.other_btn2 {
				width: 220rpx;
				height: 72rpx;
				background: linear-gradient(274deg, #AB8E68, #D7BA93);
				border-radius: 40rpx;
				font-size: 28rpx;
				color: #FFFFFF;
				text-align: center;
				line-height: 72rpx;
			}
		}

		.u-code-input {
			display: flex;
			align-items: center;
			justify-content: center;
		}

		/deep/.u-code-input__item {
			width: 30px !important;
			height: 30px !important;
			margin-right: 14px !important;
		}

		/deep/.u-code-input__item>text {
			color: #fff !important;
		}
	}

	/deep/.u-code-input__item__line {
		background: #A68A64 !important;
	}
</style>